/**
 * Styles for the mobile template
 */

body {
	font-family: HelveticaNeue, Verdana, Arial, Helvetica, sans-serif;
	background: url(../images/bg-mobile.png) no-repeat center top;
	-webkit-text-size-adjust: none;
}
textarea, input {
	font-family: HelveticaNeue, Verdana, Arial, Helvetica, sans-serif;
}

/***************** Mobile styles ****************/
button.big {
	font-size: 1.75em;
}

/* Apple's generic lists patterns customization */
/* http: //developer.apple.com/safari/library/samplecode/iPhoneListPatterns/ */
ul.edgeToEdge {
	font-weight: bold;
	background-color: white;
	color: black;
	}
	ul.edgeToEdge li {
		font-size: 1.333em;
		border-top: 1px solid rgb(217,217,217);
		padding: 0.75em 0.563em 0.75em 1em;
		height: 1.188em;
		line-height: 1.188em;
		}
		ul.edgeToEdge li:first-child
		{
			border-top: 0;
		}
	ul.edgeToEdge a {
		display: block;
		margin: -0.75em -0.563em -0.75em -1em;
		padding: 0.75em 0.563em 0.75em 1em;
		color: black;
	}
	ul.edgeToEdge .secondary {
		font-weight: normal;
		float: right;
		margin-right: 0.5em;
		}
		ul.edgeToEdge a .secondary {
			color: #3399cc;
		}
	ul.edgeToEdge .number
	{
		float: right;
		min-width: 0;
		padding: 0.063em 0.375em 0.125em;
		line-height: 1em;
		-webkit-border-radius: 0.5em;
		-webkit-background-clip: padding-box;
		-moz-border-radius: 0.5em;
		border-radius: 0.5em;
	}

ul.roundRectangle {
	font-weight: bold;
	color: black;
	background-color: white;
	border: 1px solid rgb(217,217,217);
	-webkit-border-radius: 0.5em;
	-webkit-background-clip: padding-box;
	-moz-border-radius: 0.5em;
	border-radius: 0.5em;
	}
	ul.roundRectangle.box {
		padding: 0;
	}
	ul.roundRectangle li {
		font-size: 1.333em;
		border-top: 1px solid rgb(217,217,217);
		padding: 0.75em 0.625em;
		}
		ul.roundRectangle li:first-child {
			border-top: 0;
		}
	ul.roundRectangle a {
		display: block;
		margin: -0.75em -0.625em;
		padding: 0.75em 0.625em;
		color: black;
	}
	ul.roundRectangle .showArrow {
		float: right;
		padding-right: 1em;
		background: url(../images/chevron.png) no-repeat right;
	}
	ul.roundRectangle .secondary {
		font-weight: normal;
		float: right;
		margin-right: 0.625em;
		}
		ul.roundRectangle .showArrow.secondary {
			color: #324F85;
			margin-right: 0;
		}
		ul.roundRectangle a .secondary {
			color: #324F85;
		}

/****************** Top bars ********************/
header {
	font-size: 1.333em;
	border-top: 0.063em solid #ff6500;
	height: 2.5em;
	line-height: 2.438em;
	background: black url(../images/old-browsers-bg/subnav-bg.png) repeat-x;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	background-size: 100% 100%;
	background: -moz-linear-gradient(top, #303135, #3c3d42 6%, #404447 18%, #34383b 50%, #25292c 50%, #1a1b1f 63%, black);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#303135), to(black), color-stop(.06, #3c3d42), color-stop(.18, #404447), color-stop(.5, #34383b), color-stop(.5, #25292c), color-stop(.63, #1a1b1f));
	text-align: center;
	color: white;
	padding: 0 4.5em;
	}
	header h1 {
		font-weight: bold;
		-webkit-text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5);
		-moz-text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5);
		text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5);
		height: 2.5em;
		text-overflow: ellipsis;
	}

#back {
	display: block;
	font-size: 1.167em;
	width: 76px;
	height: 40px;
	line-height: 40px;
	background: url(../images/back-button.png) no-repeat center center;
	color: white;
	text-align: center;
	text-indent: 0.286em;
	text-decoration: none;
	text-transform: uppercase;
	margin: -2.857em 0 0 0;
}
	
#menu {
	float: right;
	font-size: 1.333em;
	height: 1.75em;
	line-height: 1.75em;
	margin: -2.188em 0.25em 0 0;
	background: #465a6e url(../images/old-browsers-bg/subnav-bt-border-bg.png) repeat-x;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	background-size: 100% 100%;
	background: -moz-linear-gradient(top, #9faab6, #465a6e);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#9faab6), to(#465a6e));
	-moz-border-radius: 0.313em;
	-webkit-border-radius: 0.313em;
	-webkit-background-clip: padding-box;
	border-radius: 0.313em;
	color: white;
	padding: 0.063em;
	-moz-box-shadow: 0 0 2px #000000;
	-webkit-box-shadow: 0 0 2px #000000;
	box-shadow: 0 0 2px #000000;
	}
	#menu > a {
		display: block;
		font-size: 0.875em;
		height: 2em;
		line-height: 2em;
		padding: 0 0.857em;
		color: white;
		text-decoration: none;
		text-transform: uppercase;
		-moz-border-radius: 0.286em;
		-webkit-border-radius: 0.286em;
		-webkit-background-clip: padding-box;
		border-radius: 0.286em;
		background: #1d2a36 url(../images/old-browsers-bg/subnav-bt-bg.png) repeat-x;
		-webkit-background-size: 100% 100%;
		-moz-background-size: 100% 100%;
		-o-background-size: 100% 100%;
		background-size: 100% 100%;
		background: -moz-linear-gradient(top, #858d95, #46505b 50%, #38424d 50%, #1c2733);
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#858d95), to(#1c2733), color-stop(.5, #46505b), color-stop(.5, #38424d));
	}
	#menu.active {
		background: #6dc0e5 url(../images/old-browsers-bg/subnav-bt-hover-border-bg.png) repeat-x;
		-webkit-background-size: 100% 100%;
		-moz-background-size: 100% 100%;
		-o-background-size: 100% 100%;
		background-size: 100% 100%;
		background: -moz-linear-gradient(top, #cbe9f7, #6dc0e5);
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cbe9f7), to(#6dc0e5));
		-moz-transition: all 100ms;
		-webkit-transition: all 100ms;
		-o-transition: all 100ms;
		transition: all 100ms;
		}
		#menu.active > a {
			background: #305d79 url(../images/old-browsers-bg/subnav-bt-hover-bg.png) repeat-x;
			-webkit-background-size: 100% 100%;
			-moz-background-size: 100% 100%;
			-o-background-size: 100% 100%;
			background-size: 100% 100%;
			background: -moz-linear-gradient(left, rgba(109, 192, 229, 0), rgba(109, 192, 229, 0.2) 25%, rgba(109, 192, 229, 0.4) 50%, rgba(109, 192, 229, 0.3) 75%, rgba(109, 192, 229, 0)),
						-moz-linear-gradient(top, #afc2cf, #537288 50%, #45667c 50%, #2c526b);
			background: -webkit-gradient(linear, 0% 0%, 100% 0%, from(rgba(109, 192, 229, 0)), to(rgba(109, 192, 229, 0)), color-stop(.25, rgba(109, 192, 229, 0.3)), color-stop(.5, rgba(109, 192, 229, 0.4)), color-stop(.75, rgba(109, 192, 229, 0.3))),
						-webkit-gradient(linear, 0% 0%, 0% 100%, from(#afc2cf), to(#2c526b), color-stop(.5, #537288), color-stop(.5, #45667c));
			-moz-box-shadow: 0 0 7px #cbe9f7;
			-webkit-box-shadow: 0 0 7px #cbe9f7;
			box-shadow: 0 0 7px #cbe9f7;
			-moz-transition: all 100ms;
			-webkit-transition: all 100ms;
			-o-transition: all 100ms;
			transition: all 100ms;
		}
	
	#menu ul {
		position: absolute;
		z-index: 999910;
		left: 0;
		right: 0;
		top: 2.563em;
		text-align: left;
		border-top: 1px dotted white;
		display: none;
		background: rgba(13, 24, 30, 0.85);
		}
		#menu > ul {
			overflow: hidden;
		}
		#menu.active ul li ul {
			top: -1px;
			left: 100%;
			width: 100%;
			background: none;
		}
		#menu.active > ul,
		#menu.active li.active ul {
			display: block;
		}
		#menu ul li {
			border-bottom: 1px dotted white;
			padding: 0.75em 1.25em 0.75em 0.5em;
			text-overflow: ellipsis;
			}
			#menu ul li.red {
				background-color: #772f32;
			}
			#menu ul li a {
				display: block;
				margin: -0.75em -1.25em -0.75em -0.5em;
				padding: 0.75em 1.25em 0.75em 0.5em;
				color: white;
				text-overflow: ellipsis;
			}
			#menu ul li.with-subs > a {
				background: url(../images/chevron2.png) no-repeat 95% center;
			}
			
			/* Back button */
			#menu ul li.back {
				text-align: right;
			}
			#menu ul li.back a {
				background: rgba(255, 255, 255, 0.2) url(../images/chevron-left2.png) no-repeat 2% center;
			}

#status-bar {
	font-size: 1.333em;
	height: 3em;
	line-height: 2.938em;
	background: white url(../images/old-browsers-bg/status-bar-bg.png) repeat-x;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	background-size: 100% 100%;
	background: -moz-linear-gradient(top, white, #dadada 6%, white 92%, #cfcfcf);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(white), to(#cfcfcf), color-stop(.06, #dadada), color-stop(.92, white));
	border-bottom: 1px solid #969696;
	color: #7b7b7b;
	padding: 0 0.5em;
	}
	#status-infos {
		float: right;
		}
		#status-infos > li {
			float: left;
			margin-left: 0.5em;
			}
			#status-infos > li.spaced {
				padding-right: 0.5em;
			}
			#status-infos > li > .button {
				padding-bottom: 0.167em;
			}

#header-shadow {
	background: url(../images/old-browsers-bg/status-bar-shadow.png) repeat-x;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	background-size: 100% 100%;
	height: 0.5em;
	margin-bottom: -0.5em;
	background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.1) 30%, rgba(0, 0, 0, 0));
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0, 0, 0, 0.3)), to(rgba(0, 0, 0, 0)), color-stop(.3, rgba(0, 0, 0, 0.1)));
}

/******************* Content ********************/
article {
	padding: 0.833em;
	font-weight: normal;
	}
	article > .no-margin {
		margin-left: -0.833em;
		margin-right: -0.833em;
		}
		article > .no-margin:first-child {
			margin-top: -0.833em;
		}

.block-content h1,
.block-content .h1 {
	margin: 0 -1.111em 1.111em;
	text-align: center;
	padding: 0.389em 0.444em 0.5em;
	border-width: 1px 0;
	}
	.block-content h1:first-child,
	.block-content .h1:first-child {
		margin-top: -1.111em;
		border-top: 0;
		-moz-border-radius: 0.111em 0.111em 0 0;
		-webkit-border-top-left-radius: 0.111em;
		-webkit-border-top-right-radius: 0.111em;
		border-radius: 0.111em 0.111em 0 0;
	}
	.block-content.no-padding h1,
	.block-content.no-padding .h1 {
		margin-left: 0;
		margin-right: 0;
		}
		.block-content.no-padding h1:first-child,
		.block-content.no-padding .h1:first-child {
			margin-top: 0;
		}

/***************** Block header *****************/
.block-content .block-header:first-child,
.block-content h1 + .block-header,
.block-content .h1 + .block-header,
.block-content.no-padding h1 + .block-header,
.block-content.no-padding .h1 + .block-header {
	margin-top: -0.833em !important;
}
.block-content .block-header:first-child {
	-moz-border-radius: 0.083em 0.083em 0 0;
	-webkit-border-top-left-radius: 0.083em;
	-webkit-border-top-right-radius: 0.083em;
	border-radius: 0.083em 0.083em 0 0;
}
.block-content.no-padding .block-header:first-child {
	margin-top: 0 !important;
}

/***************** Wizard tweak *****************/
.block-content .wizard-steps:first-child,
.block-content h1 + .wizard-steps,
.block-content .h1 + .wizard-steps,
.block-content.no-padding h1 + .wizard-steps,
.block-content.no-padding .h1 + .wizard-steps {
	margin-top: -1.667em !important;
}
.block-content .wizard-steps:first-child {
	-moz-border-radius: 0.167em 0.167em 0 0;
	-webkit-border-top-left-radius: 0.167em;
	-webkit-border-top-right-radius: 0.167em;
	border-radius: 0.167em 0.167em 0 0;
}
.block-content.no-padding .wizard-steps:first-child {
	margin-top: 0 !important;
}

/**************** Block controls ****************/
.block-content .block-controls:first-child,
.block-content h1 + .block-controls,
.block-content .h1 + .block-controls,
.block-content.no-padding h1 + .block-controls,
.block-content.no-padding .h1 + .block-controls {
	margin-top: -1.667em !important;
}
.block-content .block-controls:first-child {
	-moz-border-radius-topleft: 0.2em;
	-moz-border-radius-topright: 0.2em;
	-webkit-border-top-left-radius: 0.2em;
	-webkit-border-top-right-radius: 0.2em;
	border-top-left-radius: 0.2em;
	border-top-right-radius: 0.2em;
}
.block-content.no-padding .block-controls:first-child {
	margin-top: 0 !important;
}
.block-content .block-controls:first-child ul.controls-tabs li:last-child a {
	-moz-border-radius-topright: 0.2em;
	-webkit-border-top-right-radius: 0.2em;
	border-top-right-radius: 0.2em;
}
.block-content.no-padding .block-controls:last-child {
	-moz-border-radius-bottomleft: 0.2em;
	-moz-border-radius-bottomright: 0.2em;
	-webkit-border-bottom-left-radius: 0.2em;
	-webkit-border-bottom-right-radius: 0.2em;
	border-bottom-left-radius: 0.2em;
	border-bottom-right-radius: 0.2em;
}

/****************** Messages ********************/
.message {
	font-size: 1.167em;
	line-height: 1.214em;
	-moz-border-radius: 0.286em;
	-webkit-border-radius: 0.286em;
	-webkit-background-clip: padding-box;
	border-radius: 0.286em;
	}
	ul.message {
		padding: 0.5em 0 0.071m 0;
		}
		ul.message li {
			font-size: 0.857em;
			line-height: 1.083m;
			padding: 0.167em 0.833em 0.667em 2.5em;
			background-position: 0.667em 0.083em;
		}
	p.message {
		padding: 0.643em 0.714em 0.643em 2.143em;
		background-position: 0.571em 0.571em;
	}
	section .message {
		margin-bottom: 1.429em;
	}
	.block-content .message.no-margin {
		margin: 0 -1.429em 1.429em -1.429em;
	}
	.block-content.no-title .message.no-margin:first-child {
		margin-top: -1.429em;
	}
	.block-content .message.no-margin:last-child {
		margin-bottom: -1.429em;
	}
	section .block-controls + .message.no-margin,
	section .block-header + .message.no-margin,
	section .message.no-margin + .message.no-margin {
		margin-top: -1.429em;
	}